<template>
	<view>
		<!-- 在线客服 -->
		<view class="diy-service" :style="{right: itemStyle.right +'%', bottom: itemStyle.bottom +'%'}">
		  <!-- 拨打电话 -->
		  <block v-if="params.type == 'phone' ">
		    <form @submit="_onServiceEvent" report-submit="true">
		      <button formType="submit" class="btn-normal">
		        <view class="service-icon">
		          <image class="image" :src="params.image"></image>
		        </view>
		      </button>
		    </form>
		  </block>
		  <!-- 在线聊天 -->
		  <block v-if="params.type == 'chat'">
		    <button open-type="contact" class="btn-normal">
		      <view class="service-icon">
		        <image class="image" :src="params.image"></image>
		      </view>
		    </button>
		  </block>
		</view>
	</view>
</template>

<script>
	export default {
	
		props: {
			 itemIndex: String,
			     itemStyle: Object,
			     params: Object
		},
		data() {
			return {
	
			};
		},
		methods:{
			/**
			     * 点击拨打电话
			     */
			    _onServiceEvent(e) {
			    
			      // 拨打电话
			      uni.makePhoneCall({
			        phoneNumber: this.params.phone_num
			      })
			    },
		}
	}
</script>

<style scoped>
	
	.diy-service {
	  position: fixed;
	  z-index: 999;
	}
	
	.diy-service .service-icon {
	  padding: 10rpx;
	}
	
	.diy-service .service-icon .image {
	  display: block;
	  width: 90rpx;
	  height: 90rpx;
	}
</style>
